<template>
  <div id="app">
    <VmHeader></VmHeader>
    <van-row>
      <van-col span="7"><VmLeft></VmLeft></van-col>
      <van-col span="10"><VmCenter></VmCenter></van-col>
      <van-col span="7"><VmRight></VmRight></van-col>
    </van-row>
  </div>
</template>

<script lang='ts' setup>
import { ref, reactive, computed } from 'vue'
import { useStore } from 'vuex'
import VmHeader from './components/VmHeader.vue'
import VmLeft from './components/VmLeft.vue'
import VmCenter from './components/VmCenter.vue'
import VmRight from './components/VmRight.vue'
import { useRouter, useRoute } from 'vue-router'
const router = useRouter
const route = useRoute
const store = useStore
components: {
  VmHeader, VmLeft, VmCenter, VmRight
}
</script>

<style scoped lang='scss'>
* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}
#app {
  width: 100%;
  height: 100%;
  background-image: url('./assets/image/bg.jpg');
  background-repeat: no-repeat;
  background-size: 100% 100%;
  color: #fff;
}
.van-row{
  text-align: center;
}
</style>